<template>
  <div id="qcMaterialDiv">
    <Breadcrumb content="质控品维护" />
    <div class="bodyContent">
      <Splitpanes>
        <Pane size="15">
          <vxe-table ref="instrTableRef" class="mytable-scrollbar" border align="center" height="auto" :data="instrList" :loading="instrLoading" @current-change="clickRowSelect" :expand-config="{ expandAll: true, reserve: true }" :row-config="{ isCurrent: true, isHover: true, keyField: 'id' }" :column-config="{ resizable: true }" :tree-config="{
              expandAll: true,
              rowField: 'id'
            }" resizable show-overflow keep-source :reserve="true">
            >
            <vxe-column field="instrCode" title="编码" tree-node sortable></vxe-column>
            <vxe-column field="instrName" title="名称" sortable></vxe-column>
          </vxe-table>
        </Pane>

        <Pane size="36">
          <vxe-toolbar perfect>
            <template #buttons>
              <div class="smallToolTitle">质控品维护</div>
              <vxe-input style="width: 130px" v-model="searchForm.searchValue" type="search" clearable class="vxeInputSearch" placeholder="关键字查询" @clear="findQcMaterialList" @keyup="keyupEnter" @search-click="handleSearch()"></vxe-input>
              <vxe-checkbox v-model="searchForm.isShowAll" size="small" content="显示所有批号" checked-value="1" unchecked-value="0" @change="handleSearch" :disabled="disabledTag"></vxe-checkbox>

              <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="qloading" :disabled="disabledTag" @click="findQcMaterialList"></vxe-button>

              <vxe-button type="text" class="button-blue" icon="vxe-icon-square-plus" content="新增" :disabled="disabledTag" @click="addMaterial"></vxe-button>
              <!-- <vxe-button
                type="text"
                class="button-blue"
                @click="saveMaterialAndItem('materialFormRef')"
                icon="vxe-icon-square-plus"
                content="保存"
              ></vxe-button> -->
              <vxe-button type="text" icon="vxe-icon-delete" class="button-red" content="删除" :disabled="disabledTag" @click="handleDelete"></vxe-button>
              <vxe-button type="text" icon="vxe-icon-square-plus" class="button-blue" content="靶值设定" :disabled="disabledTag" @click="setMaterialTargetDialog()"></vxe-button>

              <!-- <vxe-button type="text" class="button-blue" icon="vxe-icon-sort" content="数据同步" @click="sysMaterial"></vxe-button> -->

            </template>
          </vxe-toolbar>

          <div class="tableBody">
            <vxe-table ref="materialTableRef" class="mytable-scrollbar" border="inner" align="center" height="auto" :data="materialList" :loading="qloading" @current-change="materialRowClick" :row-config="{ isCurrent: true, isHover: true }" :column-config="{ resizable: true }" resizable show-overflow keep-source>
              <vxe-column type="checkbox" width="30px" align="center"></vxe-column>
              <vxe-column field="materialName" title="质控品名称" width="100"> </vxe-column>
              <vxe-column field="qcNo" title="质控编号" width="100"> </vxe-column>
              <vxe-column field="batchNum" title="批号" width="100"> </vxe-column>
              <vxe-column field="horizontal" title="水平" width="50">
                <template #default="{ row }">
                  <span>{{ formatCommon(horizontalList, row.horizontal) }}</span>
                </template>
              </vxe-column>
              <vxe-column field="instrName" title="仪器" width="100"> </vxe-column>
              <vxe-column field="manufacturerName" title="生产厂家" width="100"> </vxe-column>
              <vxe-column field="supplierName" title="供应商" width="100"> </vxe-column>
              <vxe-column field="enableDate" title="启用日期" width="70"> </vxe-column>
              <vxe-column field="validDate" title="有效期" width="120"> </vxe-column>
              <vxe-column field="stopDate" title="停用日期" width="70"> </vxe-column>
              <vxe-column field="stopOperator" title="停用操作者" width="100"> </vxe-column>
              <vxe-column field="entryDate" title="录入日期" width="120"> </vxe-column>
              <vxe-column field="actualBatchNum" title="实际批号" width="100"> </vxe-column>
              <vxe-column field="reportBasis" title="报告依据" width="100">
                <template #default="{ row, rowIndex, column }">
                  <span>{{ row.reportBasis ? '是' : '否' }}</span>
                </template>
              </vxe-column>
              <vxe-column field="reagentSupplierName" title="试剂供应商" width="100"> </vxe-column>
              <vxe-column field="ncclBatchNum" title="临检中心批号" width="100"> </vxe-column>
              <vxe-column field="caliManuName" title="校准品厂商" width="100" fixed="right">
              </vxe-column>
            </vxe-table>
          </div>
          <!-- 质控靶值设定弹框 -->
          <el-dialog title="质控靶值设定" :show-close="false" v-model="showTargetDialog" width="1700px" :close-on-click-modal="false" destroy-on-close v-if="showTargetDialog">
            <div class="tableTargetBody">
              <Splitpanes>
                <Pane size="15">
                  <vxe-table ref="setTargetTableRef" class="mytable-scrollbar" border height="auto" align="center" :data="materialItemList" @current-change="materialItemRowClick" :row-config="{ isCurrent: true, isHover: true }" :column-config="{ resizable: true }" resizable show-overflow keep-source>
                    <vxe-column field="itemDictName" title="报告项目名称"></vxe-column>
                    <vxe-column field="itemDefine" title="项目定义" width="150" :edit-render="{}">
                      <template #default="{ row }">
                        <span>{{ formatCommon(itemDefineList, row.itemDefine) }}</span>
                      </template>
                    </vxe-column>
                  </vxe-table>
                </Pane>
                <Pane size="85" v-show="sltMaterItem.itemDefine=='dl'">
                  <div class="tableTargetBodyRight">
                    <vxe-toolbar perfect>
                      <template #buttons>
                        <div class="smallToolTitle">质控靶值设定</div>
                        <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="iloading" @click="findMaterialTargetList"></vxe-button>
                        <vxe-button type="text" class="button-blue" icon="vxe-icon-square-plus" content="新增" @click="addMaterialTarget"></vxe-button>
                        <vxe-button type="text" class="button-blue" icon="vxe-icon-save" content="保存" @click="saveMaterialTargetList"></vxe-button>
                        <vxe-button type="text" icon="vxe-icon-delete" class="button-red" content="删除" @click="deleteMaterialTarget"></vxe-button>
                        <div class="saveBtn">
                          <vxe-checkbox v-model="jsJgFlag" size="small" content="是否重新计算结果" checked-value="1" unchecked-value="0" :disabled="disabledTag"></vxe-checkbox>
                        </div>
                        <vxe-button status="primary" class="closeBtn" content="关闭" @click="closeMaterialDialog"></vxe-button>
                      </template>
                    </vxe-toolbar>

                    <div class="tableBox">
                      <vxe-table ref="materialTargetTableRef" width="100%" class="mytable-scrollbar" border="inner" align="center" height="auto" :data="materialTargetList" :loading="iloading" :column-config="{ resizable: true }" :edit-config="{ trigger: 'click', mode: 'row', showStatus: true }" resizable show-overflow keep-source>
                        <vxe-column type="checkbox" width="30" align="center"></vxe-column>

                        <vxe-column field="enableDate" title="启用日期" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.enableDate" placeholder="日期选择" type="date"></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="mean" title="靶值" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.mean" type="number"></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="sd" title="SD" width="150" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.sd" type="number" style="width:60%;display:inline-block;"></vxe-input>
                            <div style="width:40%;display:inline-block;">
                              <vxe-button class="compute-button" content="计算CV" @click.native="computeCV(row)">
                              </vxe-button>
                            </div>
                          </template>
                        </vxe-column>
                        <vxe-column field="cv" title="CV" width="150" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.cv" type="number" style="width:60%;display:inline-block;"></vxe-input>
                            <div style="width:40%;display:inline-block;">
                              <vxe-button class="compute-button" content="计算sd" @click.native="computeSD(row)">
                              </vxe-button>
                            </div>
                          </template>
                        </vxe-column>
                        <vxe-column field="outUpper" title="失控上限" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.outUpper" type="number"></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="outLower" title="失控下限" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.outLower" type="number"></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="reagentSupplier" title="试剂供应商" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.reagentSupplier" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="reagentBatchNum" title="试剂批号" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.reagentBatchNum" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="caliManu" title="校准品厂商" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.caliManu" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="caliBatchNum" title="校准品批号" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.caliBatchNum" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="reagentManu" title="试剂厂商" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.reagentManu" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>

                        <vxe-column field="method" title="方法学" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.method" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="changeReason" title="更换靶值原因" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.changeReason" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="stopDate" title="停用日期" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.stopDate" placeholder="日期选择" type="date" transfer clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="stopOperator" title="停用操作者" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.stopOperator" disabled type="text"></vxe-input>
                          </template>
                        </vxe-column>
                      </vxe-table>
                    </div>
                  </div>
                </Pane>

                <Pane size="85" v-show="sltMaterItem.itemDefine=='dx'">
                  <div class="tableTargetBodyRight">
                    <vxe-toolbar perfect>
                      <template #buttons>
                        <div class="smallToolTitle">定性结果设定</div>
                        <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="iloading" @click="findMaterialFixedList"></vxe-button>
                        <vxe-button type="text" class="button-blue" icon="vxe-icon-square-plus" content="新增" @click="addMaterialFixed"></vxe-button>
                        <vxe-button type="text" class="button-blue" icon="vxe-icon-save" content="保存" @click="saveMaterialFixedList"></vxe-button>
                        <vxe-button type="text" icon="vxe-icon-delete" class="button-red" content="删除" @click="deleteMaterialFixed"></vxe-button>
                        <!-- <div class="saveBtn">
                          <vxe-checkbox v-model="jsJgFlag" size="small" content="是否重新计算结果" checked-value="1" unchecked-value="0" :disabled="disabledTag"></vxe-checkbox>
                        </div> -->
                        <vxe-button status="primary" class="closeBtn" content="关闭" @click="closeMaterialDialog"></vxe-button>
                      </template>
                    </vxe-toolbar>

                    <div class="tableBox">
                      <vxe-table ref="materialFixedTableRef" class="mytable-scrollbar" width="100%" border="inner" align="center" height="auto" :data="materialFixedList" :loading="iloading" :column-config="{ resizable: true }" :edit-config="{ trigger: 'click', mode: 'row', showStatus: true }" resizable show-overflow keep-source>
                        <vxe-column type="checkbox" width="30" align="center"></vxe-column>

                        <vxe-column field="enableDate" title="启用日期" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.enableDate" placeholder="日期选择" type="date"></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="result" title="质控结果" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.result" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="numResult" title="数值结果" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.numResult" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="z" title="Z分数值" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.z" type="text" clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="isAlarm" title="是否警告" width="100" :edit-render="{}">
                          <template #default="{ row }">
                            <el-tag :type="row.isAlarm ? 'success' : 'danger'">
                              {{ row.isAlarm ? '是' : '否' }}
                            </el-tag>
                          </template>
                          <template #edit="{ row }">
                            <vxe-switch v-model="row.isAlarm" open-label="是" close-label="否"></vxe-switch>
                          </template>
                        </vxe-column>
                        <vxe-column field="isOutControl" title="是否失控" width="100" :edit-render="{}">
                          <template #default="{ row }">
                            <el-tag :type="row.isOutControl ? 'success' : 'danger'">{{ row.isOutControl ? '是' : '否' }}
                            </el-tag>
                          </template>
                          <template #edit="{ row }">
                            <vxe-switch v-model="row.isOutControl" open-label="是" close-label="否"></vxe-switch>
                          </template>
                        </vxe-column>
                        <vxe-column field="stopDate" title="停用日期" width="100" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.stopDate" placeholder="日期选择" type="date" transfer clearable></vxe-input>
                          </template>
                        </vxe-column>
                        <vxe-column field="stopOperator" title="停用操作者" :edit-render="{}">
                          <template #edit="{ row, rowIndex, column }">
                            <vxe-input v-model="row.stopOperator" disabled type="text"></vxe-input>
                          </template>
                        </vxe-column>
                      </vxe-table>
                    </div>
                  </div>
                </Pane>
              </Splitpanes>
            </div>
          </el-dialog>
        </Pane>

        <Pane size="49">
          <Splitpanes horizontal class="horizontalLine">
            <Pane :size="useSize === 'small' ? 34 : useSize === 'default' ? 40 : 45">
              <div class="saveBtn">
                <vxe-button type="text" class="button-blue" @click="saveMaterialAndItem('materialFormRef')" icon="vxe-icon-square-plus" :disabled="IsEmpty(sltInstr.id)" content="保存"></vxe-button>
              </div>
              <!-- 清除浮动 -->
              <!-- <div style="clear: both;"></div> -->

              <vxe-toolbar perfect>
                <template #buttons>
                  <div class="toolbartitle">质控品详情</div>
                  <!-- <vxe-button
                    type="text"
                    class="button-blue"
                    @click="saveMaterial('materialFormRef')"
                    icon="vxe-icon-square-plus"
                    content="保存"
                  ></vxe-button> -->
                </template>
              </vxe-toolbar>
              <el-form ref="materialFormRef" :model="materialForm" :rules="materialFormRule" label-width="100px" inline-message v-loading="qloading">
                <el-row>
                  <!-- <el-col :span="7">
                    <el-form-item prop="id" label="质控品ID">
                      <el-tooltip placement="top-start" effect="dark" :content="materialForm.id">
                        <el-input type="text" v-model="materialForm.id" disabled></el-input>
                      </el-tooltip>
                    </el-form-item>
                  </el-col> -->
                  <el-col :span="7">
                    <el-form-item prop="instrId" label="仪器">
                      <el-input type="text" v-model="materialForm.instrName" disabled></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-row :gutter="2">
                      <el-col :span="19">
                        <el-form-item prop="enableDate" label="启用日期">
                          <el-date-picker v-model="materialForm.enableDate" type="date" placeholder="选择启用日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
                        </el-form-item>
                      </el-col>
                      <el-col :span="5">
                        <el-button type="primary" @click="batchSetItemEnableDate()">应用到明细</el-button>
                      </el-col>
                    </el-row>
                  </el-col>

                  <el-col :span="9">
                    <el-row :gutter="2">
                      <el-col :span="19">
                        <el-form-item prop="stopDate" label="停用日期">
                          <el-date-picker v-model="materialForm.stopDate" type="date" placeholder="选择停用日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" @change="selectStopDate($event)" />
                        </el-form-item>
                      </el-col>
                      <el-col :span="5">
                        <el-button type="primary" @click="batchSetItemStopDate()">应用到明细</el-button>
                      </el-col>
                    </el-row>
                  </el-col>

                  <el-col :span="7">
                    <el-form-item prop="qcNo" label="质控编号">
                      <el-input type="text" v-model="materialForm.qcNo" placeholder="请输入质控编号"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-row :gutter="2">
                      <el-col :span="19">
                        <el-form-item prop="validDate" label="有效期">
                          <el-date-picker v-model="materialForm.validDate" type="date" placeholder="选择有效期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
                        </el-form-item>
                      </el-col>
                      <el-col :span="5">
                        <el-button type="primary" @click="batchSetItemValidDateDate()">应用到明细</el-button>
                      </el-col>
                    </el-row>
                  </el-col>

                  <el-col :span="9">
                    <el-form-item prop="stopOperator" label="停用操作者">
                      <el-input type="text" v-model="materialForm.stopOperator" disabled></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="7">
                    <el-form-item prop="materialName" label="质控品名称">
                      <el-input type="text" v-model="materialForm.materialName" placeholder="请输入质控品名称"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-form-item prop="manufacturer" label="生产商">
                      <SelectDataList ref="manufacturerSelectRef" :url="'/lis/lab/manufacturer/findManufacturerPageList'" :displayField="[
                          { title: '编码', props: 'manuCode' }, //列标题
                          { title: '名称', props: 'manuName' }
                        ]" :placeholder="'请选择生产商'" :inputKeyName="'seachValue'" :searchParam="{ isStop: 'false' }" @selectDataRow="manufacturerSelect" @clearValue="clearManufacturerName" v-model="materialForm.manufacturerName" :isPage="true" />
                    </el-form-item>
                  </el-col>

                  <el-col :span="9">
                    <el-form-item prop="entryDate" label="录入日期">
                      <el-input type="text" v-model="materialForm.entryDate" disabled></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="7">
                    <el-form-item prop="batchNum" label="批号">
                      <el-input type="text" v-model="materialForm.batchNum" placeholder="请输入批号"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-form-item prop="supplier" label="供应商">
                      <SelectDataList ref="supplierSelectRef" :url="'/lis/lab/supplier/findSupplierPageList'" :displayField="[
                          { title: '编码', props: 'supplierCode' }, //列标题
                          { title: '名称', props: 'supplierName' }
                        ]" :placeholder="'请选择供应商'" :inputKeyName="'seachValue'" :searchParam="{ isStop: 'false' }" @selectDataRow="supplierSelect" @clearValue="clearSupplierName" v-model="materialForm.supplierName" :isPage="true" />
                    </el-form-item>
                  </el-col>

                  <el-col :span="9">
                    <el-form-item prop="entryOperator" label="录入操作者">
                      <el-input type="text" v-model="materialForm.entryOperator" disabled></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="7">
                    <el-form-item prop="horizontal" label="水平">
                      <el-select v-model="materialForm.horizontal" placeholder="请选择">
                        <el-option v-for="item in horizontalList" :key="item.code" :label="item.name" :value="item.code" />
                      </el-select>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-form-item prop="reagentSupplier" label="试剂供应商">
                      <SelectDataList ref="rSupplierSelectRef" :url="'/lis/lab/supplier/findSupplierPageList'" :placeholder="'请选择供应商'" :displayField="[
                          { title: '编码', props: 'supplierCode' }, //列标题
                          { title: '名称', props: 'supplierName' }
                        ]" :title="'请选择供应商'" :inputKeyName="'seachValue'" :searchParam="{ isStop: 'false' }" @selectDataRow="reagentSupplierSelect" @clearValue="clearReagentSupplierName" v-model="materialForm.reagentSupplierName" :isPage="true" />
                    </el-form-item>
                  </el-col>

                  <el-col :span="9">
                    <el-form-item prop="caliManu" label="校准品厂商">
                      <SelectDataList ref="caliManuSelectRef" :url="'/lis/lab/manufacturer/findManufacturerPageList'" :displayField="[
                          { title: '编码', props: 'manuCode' }, //列标题
                          { title: '名称', props: 'manuName' }
                        ]" :placeholder="'请选择生产商'" :inputKeyName="'seachValue'" :searchParam="{ isStop: 'false' }" @selectDataRow="caliManuSelect" @clearValue="clearCaliManuName" v-model="materialForm.caliManuName" :isPage="true" />
                    </el-form-item>
                  </el-col>

                  <el-col :span="7">
                    <el-form-item prop="reportBasis" label="报告依据">
                      <el-switch v-model="materialForm.reportBasis" inline-prompt active-text="是" inactive-text="否"></el-switch>
                    </el-form-item>
                  </el-col>

                  <el-col :span="8">
                    <el-form-item prop="actualBatchNum" label="实际批号">
                      <el-input type="text" v-model="materialForm.actualBatchNum" placeholder="请输入实际批号"></el-input>
                    </el-form-item>
                  </el-col>

                  <el-col :span="9">
                    <el-form-item prop="ncclBatchNum" label="临检中心批号">
                      <el-input type="text" v-model="materialForm.ncclBatchNum" placeholder="请输入临检中心批号"></el-input>
                    </el-form-item>
                  </el-col>
                  <!-- <el-col :span="24">
                    <el-form-item class="form-footer">
                      <template #default>
                        <vxe-button
                          type="text"
                          class="button-blue"
                          @click="saveMaterial('materialFormRef')"
                          icon="vxe-icon-square-plus"
                          content="保存"
                        ></vxe-button>
                      </template>
                    </el-form-item>
                  </el-col> -->
                </el-row>
              </el-form>
            </Pane>

            <Pane :size="useSize === 'small' ? 66 : useSize === 'default' ? 60 : 55">
              <vxe-toolbar perfect>
                <template #buttons>
                  <div class="smallToolTitle">质控项目设定</div>
                  <vxe-button type="text" class="button-blue" icon="vxe-icon-refresh" content="刷新" :loading="iloading" :disabled="IsEmpty(materialForm.id)" @click="findMaterialItemList"></vxe-button>
                  <vxe-button type="text" class="button-blue" icon="vxe-icon-square-plus" content="新增" :disabled="IsEmpty(materialForm.id)" @click="addMaterialItemDialog()"></vxe-button>
                  <!-- <vxe-button
                    type="text"
                    class="button-blue"
                    icon="vxe-icon-save"
                    content="保存"
                    @click="saveMaterialItemList"
                  ></vxe-button> -->
                  <vxe-button type="text" icon="vxe-icon-delete" class="button-red" content="删除" :disabled="IsEmpty(materialForm.id)" @click="deleteMaterialItem"></vxe-button>
                </template>
              </vxe-toolbar>
              <div class="tableBox">
                <vxe-table ref="materialItemTableRef" class="mytable-scrollbar" border="inner" align="center" height="auto" :data="materialItemList" :loading="iloading" :column-config="{ resizable: true }" :edit-config="{ trigger: 'click', mode: 'row', showStatus: true }" resizable show-overflow keep-source>
                  <vxe-column type="checkbox" width="30" align="center"></vxe-column>
                  <vxe-column field="itemDictName" title="质控项目名称" width="100">
                    <template #default="{ row, rowIndex, column }">
                      {{ getItemDictNameDesc(row) }}
                    </template>
                  </vxe-column>
                  <vxe-column field="enableDate" title="启用日期" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.enableDate" placeholder="日期选择" type="date" transfer></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="validDate" title="有效期" width="120" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.validDate" placeholder="日期选择" type="datetime" transfer></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="reportBasis" title="报告依据" width="80" :edit-render="{}">
                    <template #default="{ row, rowIndex, column }">
                      <span>{{ row.reportBasis ? '是' : '否' }}</span>
                    </template>
                    <template #edit="{ row }">
                      <el-switch v-model="row.reportBasis" inline-prompt active-text="是" inactive-text="否"></el-switch>
                    </template>
                  </vxe-column>
                  <vxe-column field="method" title="方法学" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.method" type="text" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="reagentSupplier" title="试剂供应商" width="100" :edit-render="{}">
                    <template #default="{ row }">
                      <span>{{ row.reagentSupplierName }}</span>
                    </template>
                    <template #edit="{ row, rowIndex, column }">
                      <SelectDataGrid :url="'/lis/lab/supplier/findSupplierPageList'" :column="[
                          { field: 'supplierCode', title: '编码' },
                          { field: 'supplierName', title: '名称' }
                        ]" :searchParam="{ isStop: 'false' }" :isPage="true" @SelectCellClick="
                          (e) => {
                            selectReagSuppRow(e, rowIndex);
                          }
                        " :showField="'supplierName'"></SelectDataGrid>
                    </template>
                  </vxe-column>

                  <vxe-column field="reagentManu" title="试剂厂商" width="100" :edit-render="{}">
                    <template #default="{ row }">
                      <span>{{ row.reagentManuName }}</span>
                    </template>
                    <template #edit="{ row, rowIndex, column }">
                      <SelectDataGrid :url="'/lis/lab/manufacturer/findManufacturerPageList'" :column="[
                          { field: 'manuCode', title: '编码' },
                          { field: 'manuName', title: '名称' }
                        ]" :searchParam="{ isStop: 'false' }" :isPage="true" @SelectCellClick="
                          (e) => {
                            selectReagManuRow(e, rowIndex);
                          }
                        " :showField="'manuName'"></SelectDataGrid>
                    </template>
                  </vxe-column>
                  <vxe-column field="reagentBatchNum" title="试剂批号" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.reagentBatchNum" type="text" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="caliBatchNum" title="校准品批号" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.caliBatchNum" type="text" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="stopDate" title="停用日期" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.stopDate" placeholder="日期选择" type="datetime" @change="selectItemStopDate(row)" clearable transfer></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="stopOperator" title="停用操作者" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.stopOperator" disabled type="text"></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="maxTea" title="允许最大误差" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.maxTea" type="float" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="maxCv" title="允许不精密度" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.maxCv" type="float" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="entryDate" title="录入日期" width="120" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.entryDate" disabled type="text"></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="entryOperator" title="录入操作者" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.entryOperator" disabled type="text" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="targetRefer" title="厂商靶值参考" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.targetRefer" type="text" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="qcRuleType" title="质控规则类别" width="100" :edit-render="{}">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.qcRuleType" type="text" clearable></vxe-input>
                    </template>
                  </vxe-column>
                  <vxe-column field="seq" title="排序" width="50" :edit-render="{}" fixed="right">
                    <template #edit="{ row, rowIndex, column }">
                      <vxe-input v-model="row.seq" type="text"></vxe-input>
                    </template>
                  </vxe-column>
                </vxe-table>
              </div>

              <!-- 新增质控项目 弹框 -->
              <el-dialog title="质控项目设定" :show-close="false" v-model="showDialog" append-to-body width="1000px" :close-on-click-modal="false" destroy-on-close v-if="showDialog">
                <div class="tableBody" style="height: 600px">
                  <vxe-table ref="qcItemTableRef" class="mytable-scrollbar dialogTable" border height="520px" align="center" :data="qcItemList" :loading="eloading" :row-config="{ keyField: 'id', isHover: true }" :column-config="{ resizable: true }" :checkbox-config="{
                      checkMethod: checCheckboxkMethod2,
                      checkRowKeys: defaultSelecteRowKeys
                    }" resizable show-overflow keep-source>
                    <vxe-column title="序号" width="80">
                      <template #default="{ row, rowIndex, column }">
                        <span>{{ rowIndex + 1 }}</span>
                      </template>
                    </vxe-column>
                    <vxe-column type="checkbox" width="30px"></vxe-column>
                    <vxe-column field="itemDefine" title="项目定义" width="150" :edit-render="{}">
                      <template #default="{ row }">
                        <span>{{ formatCommon(itemDefineList, row.itemDefine) }}</span>
                      </template>
                    </vxe-column>
                    <vxe-column field="reportCode" title="报告项目代码"></vxe-column>
                    <vxe-column field="itemDictName" title="报告项目名称"></vxe-column>

                    <vxe-column field="itemEnCode" title="英文缩写"></vxe-column>
                    <vxe-column field="itemClass" title="项目归类"></vxe-column>
                    <vxe-column field="instrClass" title="仪器大类"></vxe-column>
                    <vxe-column field="inputCode" title="输入码"></vxe-column>
                  </vxe-table>

                  <div class="dialog-footer flex right justify-end" style="margin-top: 10px">
                    <el-button type="primary" @click="saveBacthMaterialItem()">确定</el-button>
                    <el-button @click="closeDialog()">取消</el-button>
                  </div>
                </div>
              </el-dialog>
            </Pane>
          </Splitpanes>
        </Pane>
      </Splitpanes>
    </div>
  </div>
</template>
<script setup lang="ts">
// 引入组件区 ==========
import { ref, reactive, getCurrentInstance, onMounted } from 'vue';
import Breadcrumb from '@/components/Breadcrumb.vue';
import moment from 'moment';
import { Splitpanes, Pane } from 'splitpanes';
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage'; //提示框
import { AppStore } from '../../../stores/store';
import { find, isEmpty } from 'lodash';
import SelectDataList from '@/components/SelectDataList.vue';
import SelectDataGrid from '@/components/SelectDataGrid.vue';

// 全局变量定义区 ==========
// 获取屏幕高度
let conHeight = ref(document.documentElement.clientHeight);
let useSize = localStorage.getItem('uiSize');

let store = AppStore();
let { proxy }: any = getCurrentInstance();

let instrList: any = reactive([]); //最左侧仪器表格数据
let materialList: any = reactive([]); //中间质控品维护表格
let sltInstr: any = reactive({});
let materialTargetList: any = reactive([]); //质控靶值项目设定表格数据
let materialFixedList: any = reactive([]); //质控靶值项目设定表格数据
let instrLoading = ref(false); //最左侧仪器树形表格加载
let qloading = ref(false); //中间质控品维护表格加载
let tloading = ref(false); //中间质控靶值设定弹框设定表格加载
let showTargetDialog = ref(false); //中间质控靶值设定弹框展示状态
let disabledTag = ref(true); //中间质控品维护按钮标记
let iloading = ref(false); //最右侧质控项目设定表格加载
let itemDefineList: any = reactive([]); //左侧对应质控水平选择字典

let sltMaterItem: any = ref({});
let sltMaterial: any = {};
let jsJgFlag = ref('0');

let eloading = ref(false); //新增弹框表格数据加载状态
let showDialog = ref(false); //添加弹框展示状态
let qcItemList: any = reactive([]);
let horizontalList: any = reactive([]); //选择字典

let materialItemList: any = reactive([]); //质控项目设定表格数据
let defaultSelecteRowKeys = reactive([]); //弹框默认选中

let searchForm = ref({
  searchValue: '',
  isShowAll: '0'
});

let materialForm = reactive({
  id: null,
  instrId: '',
  instrName: '',
  qcNo: '',
  materialName: '',
  batchNum: '',
  actualBatchNum: '',
  horizontal: '',
  manufacturer: '',
  manufacturerName: '',
  supplier: '',
  supplierName: '',
  reagentSupplier: '',
  reagentSupplierName: '',
  enableDate: '',
  validDate: '',
  stopDate: '',
  stopOperator: '',
  entryDate: '',
  entryOperator: '',
  caliManu: '',
  caliManuName: '',
  ncclBatchNum: '',
  reportBasis: true,
  seq: 1,
  orgId: ''
});

// 清空表单
function clearMaterialForm() {
  materialForm.id = null;
  materialForm.instrId = '';
  materialForm.instrName = '';
  materialForm.qcNo = '';
  materialForm.materialName = '';
  materialForm.batchNum = '';
  materialForm.actualBatchNum = '';
  materialForm.horizontal = '';
  materialForm.manufacturer = '';
  materialForm.manufacturerName = '';
  materialForm.supplier = '';
  materialForm.supplierName = '';
  materialForm.reagentSupplier = '';
  materialForm.reagentSupplierName = '';
  materialForm.enableDate = '';
  materialForm.validDate = '';
  materialForm.stopDate = '';
  materialForm.stopOperator = '';
  materialForm.entryDate = '';
  materialForm.entryOperator = '';
  materialForm.caliManu = '';
  materialForm.caliManuName = '';
  materialForm.ncclBatchNum = '';
  materialForm.reportBasis = true;
  materialForm.orgId = '';
  materialForm.seq = 1;

  const el: any = proxy.$refs['materialFormRef'];
  //移除校验结果
  el.clearValidate();
}

// 表单校验
let materialFormRule = {
  materialName: [
    {
      required: true,
      message: '请输入质控品名称',
      trigger: 'blur'
    },
    {
      min: 2,
      max: 20,
      message: '长度为2到20个字符',
      trigger: 'blur'
    }
  ],
  validDate: [
    {
      required: true,
      message: '请输入有效期',
      trigger: 'blur'
    }
  ],
  horizontal: [
    {
      required: true,
      message: '请输入水平',
      trigger: 'blur'
    }
  ]
};

// 方法定义区 =============
// 页面加载时更新列表(左侧)
onMounted(() => {
  findInstrList(); // 获取最左侧 树形表格数据
  getDictItemsList(); //批量获取字典
});

//批量获取字典
async function getDictItemsList() {
  let dictTreeTypeCodes: any = ['QCHORIZONTAL', 'QCItemDefine'];

  const codes = dictTreeTypeCodes.join(',');
  const url = '/api/sys/basDictDetail/findDictDetailListByDictCodes';
  const dictTreeTypeItems: any = await proxy.$http.get(url, { params: { code: codes } });
  const horizontalType = dictTreeTypeItems.data.find((item) => item.code === 'QCHORIZONTAL');
  horizontalList.push(...horizontalType.detailDataList);
  const iDefineType = dictTreeTypeItems.data.find((item) => item.code === 'QCItemDefine');
  itemDefineList.push(...iDefineType.detailDataList);
}

// 获取最左侧 树形表格数据
function findInstrList() {
  instrLoading.value = true;
  instrList.length = 0; //放入数据前清空数据
  const url = '/api/qc/qcInstrItem/findInstrClassAndInstrList';
  proxy.$http
    //注意此处的数据条数
    .get(url, {
      params: { seachValue: '' }
    })
    .then((res: any) => {
      instrList.push(...res.data);
      instrLoading.value = false;
      if (instrList.length > 0) {
        const sltObj = getChildren(instrList[0]);
        sltInstr = sltObj;
        setCurTypeNode(sltObj);
        clickRowSelect({ row: sltInstr }); //点击当前行获取右侧质控项目表格数据
      }
    })
    .catch((err: any) => {
      instrLoading.value = false;
      VxeMessage('获取最左侧表格数据异常', VxeNotifyType.error);
    });
}

// 光标定位在指定字典分类上
function setCurTypeNode(sltObj: any) {
  proxy.$nextTick(() => {
    const treeName = 'instrTableRef';
    const tree: any = proxy.$refs[treeName];
    tree.setCurrentRow(sltObj);
  });
}
function getChildren(obj: any) {
  const children = obj.children;
  return children[0];
}

// 点击树形表格当前行获取右侧表格数据
function clickRowSelect({ row }) {
  const isSearch = row.isSearch;
  if (isSearch == '0') {
    sltInstr = row;
    findQcMaterialList(); // 右侧获取质控项目表格数据
  } else {
    materialList.length = 0;
    materialItemList.length = 0;
    clearMaterialForm();
    sltInstr = reactive({});
  }
  //如果点击的当前行数据是父级，那就禁用质控品维护的按钮
  if (!sltInstr.id) {
    disabledTag.value = true;
  } else {
    //如果点击的当前行数据是子集，那就不需要禁用质控品维护的按钮
    disabledTag.value = false;
  }
}

// 获取中间质控品维护数据
function findQcMaterialList() {
  const el: any = proxy.$refs['materialFormRef'];
  //移除校验结果
  el.clearValidate();
  if (IsEmpty(sltInstr)) {
    VxeMessage('请选择仪器', VxeNotifyType.error);
  } else {
    qloading.value = true;
    materialList.length = 0; //放入数据前清空数据
    const url = '/api/qc/qcMaterial/findQcMaterialList';
    proxy.$http
      //注意此处的数据条数
      .get(url, {
        params: { pid: sltInstr.id, isShowAll: searchForm.value.isShowAll }
      })
      .then((res: any) => {
        materialList.push(...res.data);
        if (materialList.length == 0) {
          clearMaterialForm();
          materialForm.instrId = sltInstr.id;
          materialForm.instrName = sltInstr.instrName;
          materialItemList.length = 0; //放入数据前清空数据
          sltMaterial = {};
        } else {
          let idx = 0;
          if (isEmpty(sltMaterial.id)) {
            idx = 0;
          } else {
            const mids = materialList.map((p: any) => p.id);
            const index = mids.findIndex((p: any) => p == sltMaterial.id);
            if (index > -1) {
              idx = index;
            } else {
              idx = 0;
            }
          }
          materialRowClick({ row: materialList[idx] }); //默认选中第一条数据
        }
        qloading.value = false;
      })
      .catch((err: any) => {
        qloading.value = false;
        // VxeMessage('获取获取当前字典的字段列表失败',VxeNotifyType.error)
      });
  }
}

// 回车查询
function keyupEnter(e: any) {
  if (e.$event.code == 'Enter') {
    handleSearch();
  }
}

// 查询/刷新(关键字)
function handleSearch() {
  qloading.value = true;
  materialList.length = 0; //放入数据前清空数据
  const url = '/api/qc/qcMaterial/findQcMaterialList';
  proxy.$http
    .get(url, {
      params: {
        pid: sltInstr.id,
        seachValue: searchForm.value.searchValue,
        isShowAll: searchForm.value.isShowAll
      }
    })
    .then((res: any) => {
      materialList.push(...res.data);
      if (materialList.length == 0) {
        clearMaterialForm();
        materialForm.instrId = sltInstr.id;
        materialForm.instrName = sltInstr.instrName;
        materialItemList.length = 0; //放入数据前清空数据
        sltMaterial = {};
      } else {
        let idx = 0;
        if (isEmpty(sltMaterial.id)) {
          idx = 0;
        } else {
          const mids = materialList.map((p: any) => p.id);
          const index = mids.findIndex((p: any) => p == sltMaterial.id);
          if (index > -1) {
            idx = index;
          } else {
            idx = 0;
          }
        }
        materialRowClick({ row: materialList[idx] }); //默认选中第一条数据
      }
      qloading.value = false;
    })
    .catch((err: any) => {
      qloading.value = false;
      VxeMessage('查询刷新失败', VxeNotifyType.error);
    });
}

// 中间质控品维护添加
function addMaterial() {
  if (IsEmpty(sltInstr)) {
    VxeMessage('请选择仪器', VxeNotifyType.error);
  } else {
    clearMaterialForm();
    sltMaterial = {};
    materialForm.instrId = sltInstr.id;
    materialForm.instrName = sltInstr.instrName;
    materialForm.seq = materialList.length + 1;
    materialForm.enableDate = moment().format('YYYY-MM-DD');
    (proxy.$refs.materialTableRef as any).clearCurrentRow();
    materialItemList.length = 0;
  }
}

// 最右侧表单保存(废弃)
function saveMaterial(formName: any) {
  let $el = proxy.$refs[formName];
  $el.validate((valid: any) => {
    if (!valid) {
      return false;
    }

    if (materialForm.id === null) {
      const url = '/api/qc/qcMaterial/addQcMaterial';
      const obj: any = {};
      Object.assign(obj, materialForm);
      //录入日期
      obj.validDate = isEmpty(materialForm.validDate) ? '' : materialForm.validDate + ' 23:59:59';
      obj.stopDate = isEmpty(materialForm.stopDate) ? '' : materialForm.stopDate + ' 23:59:59';
      obj.entryDate = moment().format('YYYY-MM-DD HH:mm:ss');
      //录入人
      obj.entryOperator = store.userInfo.id;
      proxy.$http
        .post(url, obj)
        .then((res: any) => {
          VxeMessage('新增质控品成功', VxeNotifyType.success);
          clearMaterialForm();
          findQcMaterialList();
        })
        .catch((err: any) => {
          VxeMessage('新增质控品失败', VxeNotifyType.error);
        });
    } else {
      // 修改用户
      const url = '/api/qc/qcMaterial/editQcMaterial';
      const obj: any = {};
      Object.assign(obj, materialForm);
      obj.validDate = isEmpty(materialForm.validDate) ? '' : materialForm.validDate + ' 23:59:59';
      obj.stopDate = isEmpty(materialForm.stopDate) ? '' : materialForm.stopDate + ' 23:59:59';

      proxy.$http
        .post(url, obj)
        .then((res: any) => {
          VxeMessage('修改质控品成功', VxeNotifyType.success);
          setTimeout(() => {
            clearMaterialForm();
            findQcMaterialList();
          }, 500);
        })
        .catch((err: any) => {
          VxeMessage('修改质控品失败', VxeNotifyType.success);
        });
    }
  });
}

// 点击质控品维护表格当前行触发右侧表单变化
function materialRowClick({ row }: any) {
  if (IsEmpty(row)) {
    clearMaterialForm();
    sltMaterial = {};
  } else {
    (proxy.$refs.materialTableRef as any).setCurrentRow(row);
    setMaterialForm(row);
    sltMaterial = row;
  }
}

function setMaterialForm(row: any) {
  Object.assign(materialForm, row);
  findMaterialItemList(); // 获取最右侧 质控项目设定表格数据
}

// 中间删除按钮
function handleDelete() {
  const sltQcMaterials = (proxy.$refs.materialTableRef as any).getCheckboxRecords();
  if (!(sltQcMaterials.length > 0)) {
    VxeMessage('请勾选要删除的数据', VxeNotifyType.info);
  } else {
    proxy
      .$confirm('确定要删除当前勾选的数据？', '提示', {
        cancelButtonClass: 'cancel-button',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
      .then(() => {
        const data = { qcMaterialList: sltQcMaterials };
        const url = '/api/qc/qcMaterial/batchDeleteQcMaterialList';
        proxy.$http
          .post(url, data)
          .then((res: any) => {
            findQcMaterialList(); // 获取检验仪器表格数据
            VxeMessage(res.status.msg, VxeNotifyType.success);
          })
          .catch((err: any) => {
            VxeMessage(err, VxeNotifyType.error);
          });
      })
      .catch((err: any) => {
        // VxeMessage(err, VxeNotifyType.error);
      });
  }
}

// 靶值设定打开弹框
function setMaterialTargetDialog() {
  if (materialItemList.length == 0) {
    VxeMessage('没有添加质控项目', VxeNotifyType.error);
  } else {
    showTargetDialog.value = true;
    proxy.$nextTick(() => {
      materialItemRowClick({ row: materialItemList[0] }); //默认选中第一条数据
    });
  }
}

// 质控靶值设定弹框左侧 ——点击当前行
function materialItemRowClick({ row }: any) {
  (proxy.$refs.setTargetTableRef as any).setCurrentRow(row);
  sltMaterItem.value = row;
  if (sltMaterItem.value.itemDefine == 'dl') {
    findMaterialTargetList();
  } else if (sltMaterItem.value.itemDefine == 'dx') {
    findMaterialFixedList();
  }
}

// 质控靶值设定弹框 ——获取质控靶值表格数据
function findMaterialTargetList() {
  tloading.value = true;
  materialTargetList.length = 0; //放入数据前清空数据
  const url = '/api/qc/qcMaterialItemTarget/findMaterialTargetList';
  proxy.$http
    //注意此处的数据条数
    .get(url, {
      params: { pid: sltMaterItem.value.id }
    })
    .then((res: any) => {
      materialTargetList.push(...res.data);
      tloading.value = false;
    })
    .catch((err: any) => {
      tloading.value = false;
      VxeMessage('获取质控靶值表格数据异常', VxeNotifyType.error);
    });
}

// 新增质控靶值设定表格数据
function addMaterialTarget() {
  if (isEmpty(sltMaterItem.value)) {
    VxeMessage('请选择质控项目', VxeNotifyType.error);
  } else {
    const record = {
      id: '',
      materialItemId: sltMaterItem.value.id,
      materialId: sltMaterItem.value.materialId,
      qcItemId: sltMaterItem.value.qcItemId,
      instrId: sltMaterItem.value.instrId,
      itemDictId: sltMaterItem.value.itemDictId,
      enableDate: materialForm.enableDate,
      seq: materialTargetList.length + 1 //排序号
    };
    materialTargetList.push(record);
  }
}

// 保存质控靶值设定表格数据
async function saveMaterialTargetList() {
  if (isEmpty(sltMaterItem.value)) {
    VxeMessage('请选择质控项目', VxeNotifyType.error);
  } else {
    let $Xtable = proxy.$refs.materialTargetTableRef;
    if ($Xtable) {
      // 表格实例表用该方法拿到有id的为修改
      const updateRecords = await $Xtable.getUpdateRecords().filter((p: any) => {
        return p.id && p.id !== '';
      });
      // 拿到数组中没有id的数据为新增
      const InsertRecords = materialTargetList.filter((e: any) => {
        return !e.id || e.id === '';
      });

      const sveOrupdateitems = [] as any[];
      updateRecords.forEach((e: any) => {
        const maItem = {
          id: e.id,
          materialId: e.materialId,
          materialItemId: e.materialItemId,
          qcItemId: e.qcItemId,
          instrId: e.instrId,
          itemDictId: e.itemDictId,
          enableDate: e.enableDate,
          mean: e.mean,
          sd: e.sd,
          cv: e.cv,
          outUpper: e.outUpper,
          outLower: e.outLower,
          reagentBatchNum: e.reagentBatchNum,
          reagentSupplier: e.reagentSupplier,
          caliManu: e.caliManu,
          caliBatchNum: e.caliBatchNum,
          reagentManu: e.reagentManu,
          method: e.method,
          stopDate: e.stopDate,
          stopOperator: e.stopOperator,
          orgId: e.orgId,
          seq: e.seq
        };
        maItem.stopDate = isEmpty(maItem.stopDate) ? '' : maItem.stopDate + ' 23:59:59';

        sveOrupdateitems.push(maItem);
      });
      InsertRecords.forEach((e: any) => {
        const maItem = {
          id: e.id,
          materialId: e.materialId,
          materialItemId: e.materialItemId,
          qcItemId: e.qcItemId,
          instrId: e.instrId,
          itemDictId: e.itemDictId,
          enableDate: e.enableDate,
          mean: e.mean,
          sd: e.sd,
          cv: e.cv,
          outUpper: e.outUpper,
          outLower: e.outLower,
          reagentBatchNum: e.reagentBatchNum,
          reagentSupplier: e.reagentSupplier,
          caliManu: e.caliManu,
          caliBatchNum: e.caliBatchNum,
          reagentManu: e.reagentManu,
          method: e.method,
          stopDate: e.stopDate,
          stopOperator: e.stopOperator,
          orgId: store.userInfo.orgId,
          seq: e.seq
        };
        maItem.stopDate = isEmpty(maItem.stopDate) ? '' : maItem.stopDate + ' 23:59:59';

        sveOrupdateitems.push(maItem);
      });

      if (sveOrupdateitems.length > 0) {
        const url = '/api/qc/qcMaterialItemTarget/saveOrUpdateMaterialTarget';
        const obj: any = {};
        obj.materialTargetList = sveOrupdateitems;
        obj.jsJgFlag = jsJgFlag.value;
        proxy.$http
          .post(url, obj)
          .then((res: any) => {
            VxeMessage('修改成功', VxeNotifyType.success);
            setTimeout(() => {
              jsJgFlag.value = '0';
              findMaterialTargetList();
            }, 50);
          })
          .catch((err: any) => {
            VxeMessage('修改失败', VxeNotifyType.success);
          });
      } else {
        VxeMessage('无添加或修改数据', VxeNotifyType.error);
      }
    } else {
      return;
    }
  }
}

// 删除质控靶值设定表格数据
function deleteMaterialTarget() {
  const sltMaterialTargets = (proxy.$refs.materialTargetTableRef as any).getCheckboxRecords();
  if (!(sltMaterialTargets.length > 0)) {
    VxeMessage('请勾选要删除的数据', VxeNotifyType.info);
  } else {
    proxy
      .$confirm('确定要删除当前勾选的数据？', '提示', {
        cancelButtonClass: 'cancel-button',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
      .then(() => {
        const data = { materialTargetList: sltMaterialTargets };
        const url = '/api/qc/qcMaterialItemTarget/batchDeleteMaterialTargetList';
        proxy.$http
          .post(url, data)
          .then((res: any) => {
            findMaterialTargetList(); // 获取检验仪器表格数据
            VxeMessage(res.status.msg, VxeNotifyType.success);
          })
          .catch((err: any) => {
            VxeMessage(err, VxeNotifyType.error);
          });
      })
      .catch((err: any) => {
        // VxeMessage(err, VxeNotifyType.error);
      });
  }
}

// 关闭质控靶值设定弹框
function closeMaterialDialog() {
  showTargetDialog.value = false;
  sltMaterItem.value = {};
  materialTargetList.length = 0;
}

// 质控项目设定 新增弹框
function addMaterialItemDialog() {
  findQcItemList(); // 获取弹框表格数据
  showDialog.value = true;
}
// 弹框取消按钮
function closeDialog() {
  showDialog.value = false;
}
// 获取弹框表格数据
function findQcItemList() {
  eloading.value = true;
  qcItemList.length = 0; //放入数据前清空数据
  const url = '/api/qc/qcInstrItem/findQcInstrItemList';
  proxy.$http
    //注意此处的数据条数
    .get(url, {
      params: {
        pid: sltInstr.id,
        seachValue: ''
      }
    })
    .then((res: any) => {
      qcItemList.push(...res.data);
      eloading.value = false;
    })
    .catch((err: any) => {
      eloading.value = false;
      VxeMessage('获取弹框表格数据异常', VxeNotifyType.error);
    });
}

// 弹框确定按钮
function saveBacthMaterialItem() {
  const selectRows = (proxy.$refs.qcItemTableRef as any).getCheckboxRecords();
  if (selectRows.length > 0) {
    const addMaterialItemList = [];
    for (const sltRow of selectRows) {
      const materialItem = materialItemList.find((mt: any) => mt.qcItemId == sltRow.id);
      if (IsEmpty(materialItem)) {
        const addMaterialItem = {
          materialId: materialForm.id,
          qcItemId: sltRow.id,
          instrId: sltRow.instrId,
          itemDictId: sltRow.itemDictId,
          itemDefine: sltRow.itemDefine,
          reportBasis: materialForm.reportBasis,
          enableDate: materialForm.enableDate,
          entryDate: moment().format('YYYY-MM-DD HH:mm:ss'),
          entryOperator: store.userInfo.id,
          validDate: moment(materialForm.validDate).format('YYYY-MM-DD') + ' 23:59:59',
          status: 0,
          seq: sltRow.seq,
          orgId: store.userInfo.orgId
        };
        addMaterialItemList.push(addMaterialItem);
      }
    }
    if (addMaterialItemList.length > 0) {
      const data = { materialItemList: addMaterialItemList };
      const url = '/api/qc/qcMaterialItem/batchAddMaterialItemList';
      proxy.$http
        .post(url, data)
        .then((res: any) => {
          findMaterialItemList(); // 获取最右侧 质控项目设定表格数据
          VxeMessage(res.status.msg, VxeNotifyType.success);
        })
        .catch((err: any) => {
          VxeMessage(err, VxeNotifyType.error);
        });
    }
  }
  closeDialog();
}

// 获取最右侧 质控项目设定表格数据
function findMaterialItemList() {
  iloading.value = true;
  materialItemList.length = 0; //放入数据前清空数据
  const url = '/api/qc/qcMaterialItem/findMaterialItemList';
  proxy.$http
    //注意此处的数据条数
    .get(url, {
      params: { pid: materialForm.id }
    })
    .then((res: any) => {
      materialItemList.push(...res.data);
      iloading.value = false;
    })
    .catch((err: any) => {
      iloading.value = false;
      VxeMessage('获取右侧获取质控项目表格数据异常', VxeNotifyType.error);
    });
}

// 质控项目设定保存(废弃)
async function saveMaterialItemList() {
  // 获取表格实例
  let $Xtable = proxy.$refs.materialItemTableRef;
  if ($Xtable) {
    // 表格实例表用该方法拿到有id的为修改
    const updateRecords = await $Xtable.getUpdateRecords().filter((p: any) => {
      return p.id !== '';
    });

    // 遍历发起请求  将筛选出有id的每一个对象（修改过的） 作为参数传递给后端
    const updateitems = [] as any[];
    updateRecords.forEach((e: any) => {
      const maItem = {
        id: e.id,
        enableDate: e.enableDate,
        validDate: e.validDate,
        reportBasis: e.reportBasis,
        method: e.method,
        reagentSupplier: e.reagentSupplier,
        reagentBatchNum: e.reagentBatchNum,
        caliBatchNum: e.caliBatchNum,
        stopDate: e.stopDate,
        stopOperator: e.stopOperator,
        maxTea: e.maxTea,
        maxCv: e.maxCv,
        entryDate: e.entryDate,
        entryOperator: e.entryOperator,
        targetRefer: e.targetRefer,
        qcRuleType: e.qcRuleType,
        seq: e.seq
      };

      updateitems.push(maItem);
    });

    const updateobj = {
      materialItemList: updateitems
    };
    if (updateobj.materialItemList.length > 0) {
      //批量修改
      proxy.$http
        .post('/api/qc/qcMaterialItem/editBatchMaterialItem', updateobj)
        .then((res: any) => {
          if (res.status.code === 1) {
            VxeMessage('修改成功', VxeNotifyType.success);
          } else {
            VxeMessage('修改失败', VxeNotifyType.error);
          }
          findMaterialItemList();
        })
        .catch((err: any) => {
          VxeMessage('修改异常', VxeNotifyType.error);
        });
    }
  } else {
    return;
  }
}

// 最右侧整个表单+表格数据 保存
function saveMaterialAndItem(formName: any) {
  if (IsEmpty(sltInstr)) {
    VxeMessage('请选择仪器', VxeNotifyType.error);
  } else {
    let $el = proxy.$refs[formName];
    $el.validate((valid: any) => {
      if (!valid) {
        return false;
      }

      if (materialForm.id === null) {
        const url = '/api/qc/qcMaterial/addQcMaterial';
        const obj: any = {};
        Object.assign(obj, materialForm);
        //录入日期
        obj.validDate = isEmpty(materialForm.validDate) ? '' : materialForm.validDate + ' 23:59:59';
        obj.stopDate = isEmpty(materialForm.stopDate) ? '' : materialForm.stopDate + ' 23:59:59';
        obj.entryDate = moment().format('YYYY-MM-DD HH:mm:ss');
        obj.orgId = store.userInfo.orgId;
        //录入人
        obj.entryOperator = store.userInfo.id;
        proxy.$http
          .post(url, obj)
          .then((res: any) => {
            VxeMessage('新增质控品成功', VxeNotifyType.success);
            clearMaterialForm();
            sltMaterial = res.data;
            findQcMaterialList();
          })
          .catch((err: any) => {
            VxeMessage('新增质控品失败', VxeNotifyType.error);
          });
      } else {
        // 修改用户
        const url = '/api/qc/qcMaterial/editQcMaterialAndBatchItem';
        const obj: any = {};
        Object.assign(obj, materialForm);
        obj.validDate = isEmpty(materialForm.validDate) ? '' : materialForm.validDate + ' 23:59:59';
        obj.stopDate = isEmpty(materialForm.stopDate) ? '' : materialForm.stopDate + ' 23:59:59';

        // 获取表格实例
        let $Xtable = proxy.$refs.materialItemTableRef;
        if ($Xtable) {
          // 表格实例表用该方法拿到有id的为修改
          const updateRecords = $Xtable.getUpdateRecords().filter((p: any) => {
            return p.id !== '';
          });
          // 遍历发起请求  将筛选出有id的每一个对象（修改过的） 作为参数传递给后端
          const updateitems = [] as any[];
          updateRecords.forEach((e: any) => {
            const maItem = {
              id: e.id,
              enableDate: e.enableDate,
              validDate: e.validDate,
              reportBasis: e.reportBasis,
              method: e.method,
              reagentSupplier: e.reagentSupplier,
              reagentManu: e.reagentManu,
              reagentBatchNum: e.reagentBatchNum,
              caliBatchNum: e.caliBatchNum,
              stopDate: e.stopDate,
              stopOperator: e.stopOperator,
              maxTea: e.maxTea,
              maxCv: e.maxCv,
              entryDate: e.entryDate,
              entryOperator: e.entryOperator,
              targetRefer: e.targetRefer,
              qcRuleType: e.qcRuleType,
              seq: e.seq
            };

            updateitems.push(maItem);
          });
          obj.materialItemList = updateitems;
        }
        proxy.$http
          .post(url, obj)
          .then((res: any) => {
            VxeMessage('修改成功', VxeNotifyType.success);
            setTimeout(() => {
              clearMaterialForm();
              findQcMaterialList();
            }, 500);
          })
          .catch((err: any) => {
            VxeMessage('修改失败', VxeNotifyType.success);
          });
      }
    });
  }
}

// 质控项目设定 删除
function deleteMaterialItem() {
  const sltMaterialItems = (proxy.$refs.materialItemTableRef as any).getCheckboxRecords();
  if (!(sltMaterialItems.length > 0)) {
    VxeMessage('请勾选要删除的数据', VxeNotifyType.info);
  } else {
    proxy
      .$confirm('确定要删除当前勾选的数据？', '提示', {
        cancelButtonClass: 'cancel-button',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
      .then(() => {
        const data = { materialItemList: sltMaterialItems };
        const url = '/api/qc/qcMaterialItem/batchDeleteMaterialItemList';
        proxy.$http
          .post(url, data)
          .then((res: any) => {
            findMaterialItemList(); // 获取检验仪器表格数据
            VxeMessage(res.status.msg, VxeNotifyType.success);
          })
          .catch((err: any) => {
            VxeMessage(err, VxeNotifyType.error);
          });
      })
      .catch((err: any) => {
        // VxeMessage(err, VxeNotifyType.error);
      });
  }
}

// 弹框 表格复选框(是否允许用户手动勾选)
function checCheckboxkMethod2({ row }: any) {
  defaultSelecteRowKeys.length = 0;
  const obj = materialItemList.filter((p: any) => {
    defaultSelecteRowKeys.push(p.qcItemId);
    return p.qcItemId == row.id;
  });
  return obj.length == 0;
}

// 质控项目设定表格  —— 质控项目名称
function getItemDictNameDesc(row: any) {
  let itemDictNameDesc = '';
  if (!isEmpty(row.itemEnCode)) {
    itemDictNameDesc += row.itemEnCode + ' ';
  }
  itemDictNameDesc += row.itemDictName;
  return itemDictNameDesc;
}

// form表单 选择停用日期
function selectStopDate(val: any) {
  if (IsEmpty(val)) {
    materialForm.stopOperator = '';
  } else {
    materialForm.stopOperator = store.userInfo.id;
  }
}

// 表格 选择停用日期
function selectItemStopDate(item: any) {
  if (IsEmpty(item.stopDate)) {
    item.stopOperator = '';
  } else {
    item.stopOperator = store.userInfo.id;
  }
}

function formatCommon(arr, value) {
  for (const item of arr) {
    if (item.code == value) {
      return item.name;
    }
  }
}

function batchSetItemStopDate() {
  if (IsEmpty(materialForm.stopDate)) {
    for (const mitem of materialItemList) {
      mitem.stopOperator = '';
      mitem.stopDate = '';
    }
  } else {
    for (const mitem of materialItemList) {
      mitem.stopOperator = store.userInfo.id;
      mitem.stopDate = moment(materialForm.stopDate).format('YYYY-MM-DD') + ' 23:59:59';
    }
  }
}
function batchSetItemEnableDate() {
  if (IsEmpty(materialForm.enableDate)) {
    for (const mitem of materialItemList) {
      mitem.enableDate = '';
    }
  } else {
    for (const mitem of materialItemList) {
      mitem.enableDate = moment(materialForm.enableDate).format('YYYY-MM-DD');
    }
  }
}
function batchSetItemValidDateDate() {
  if (IsEmpty(materialForm.validDate)) {
    for (const mitem of materialItemList) {
      mitem.validDate = '';
    }
  } else {
    for (const mitem of materialItemList) {
      mitem.validDate = moment(materialForm.validDate).format('YYYY-MM-DD') + ' 23:59:59';
    }
  }
}

function supplierSelect(row) {
  materialForm.supplier = row.id;
  materialForm.supplierName = row.supplierName;
}
function clearSupplierName() {
  materialForm.supplier = '';
  materialForm.supplierName = '';
}
function reagentSupplierSelect(row) {
  materialForm.reagentSupplier = row.id;
  materialForm.reagentSupplierName = row.supplierName;
}
function clearReagentSupplierName() {
  materialForm.reagentSupplier = '';
  materialForm.reagentSupplierName = '';
}

function manufacturerSelect(row) {
  materialForm.manufacturer = row.id;
  materialForm.manufacturerName = row.manuName;
}
function clearManufacturerName() {
  materialForm.manufacturer = '';
  materialForm.manufacturerName = '';
}
function caliManuSelect(row) {
  materialForm.caliManu = row.id;
  materialForm.caliManuName = row.manuName;
}
function clearCaliManuName() {
  materialForm.caliManu = '';
  materialForm.caliManuName = '';
}
// 获取组件当前行数据
function selectReagSuppRow(row, index) {
  materialItemList[index].reagentSupplierName = row.supplierName;
  materialItemList[index].reagentSupplier = row.id;
}

function selectReagManuRow(row, index) {
  materialItemList[index].reagentManuName = row.manuName;
  materialItemList[index].reagentManu = row.id;
}

// ------------------------------------------------------------
//**判断为空*/
function IsEmpty(value: any) {
  if (value === undefined || value === '' || value === null) {
    return true;
  }
  if (JSON.stringify(value) === '{}') {
    return true;
  }
  return false;
}
function computeCV(row: any) {
  row.cv = parseFloat(((row.sd / row.mean) * 100).toFixed(6));
}
function computeSD(row: any) {
  row.sd = parseFloat(((row.mean * row.cv) / 100).toFixed(6));
}

// 质控靶值设定弹框 ——获取质控靶值表格数据
function findMaterialFixedList() {
  tloading.value = true;
  materialFixedList.length = 0; //放入数据前清空数据
  const url = '/api/qc/qcMaterialItemFixed/findMaterialFixedList';
  proxy.$http
    //注意此处的数据条数
    .get(url, {
      params: { pid: sltMaterItem.value.id }
    })
    .then((res: any) => {
      materialFixedList.push(...res.data);
      tloading.value = false;
    })
    .catch((err: any) => {
      tloading.value = false;
      VxeMessage('获取质控靶值表格数据异常', VxeNotifyType.error);
    });
}

// 新增质控靶值设定表格数据
function addMaterialFixed() {
  if (isEmpty(sltMaterItem.value)) {
    VxeMessage('请选择质控项目', VxeNotifyType.error);
  } else {
    const record = {
      id: '',
      materialItemId: sltMaterItem.value.id,
      materialId: sltMaterItem.value.materialId,
      qcItemId: sltMaterItem.value.qcItemId,
      instrId: sltMaterItem.value.instrId,
      itemDictId: sltMaterItem.value.itemDictId,
      enableDate: materialForm.enableDate,
      isAlarm: false,
      isOutControl: false,
      seq: materialFixedList.length + 1 //排序号
    };
    materialFixedList.push(record);
  }
}

// 保存质控靶值设定表格数据
async function saveMaterialFixedList() {
  if (isEmpty(sltMaterItem.value)) {
    VxeMessage('请选择质控项目', VxeNotifyType.error);
  } else {
    let $Xtable = proxy.$refs.materialFixedTableRef;
    if ($Xtable) {
      // 表格实例表用该方法拿到有id的为修改
      const updateRecords = await $Xtable.getUpdateRecords().filter((p: any) => {
        return p.id && p.id !== '';
      });
      // 拿到数组中没有id的数据为新增
      const InsertRecords = materialFixedList.filter((e: any) => {
        return !e.id || e.id === '';
      });

      const sveOrupdateitems = [] as any[];
      updateRecords.forEach((e: any) => {
        const maItem = {
          id: e.id,
          materialId: e.materialId,
          materialItemId: e.materialItemId,
          qcItemId: e.qcItemId,
          instrId: e.instrId,
          itemDictId: e.itemDictId,
          enableDate: e.enableDate,
          isAlarm: e.isAlarm,
          isOutControl: e.isOutControl,
          result: e.result,
          numResult: e.numResult,
          z: e.z,
          stopDate: e.stopDate,
          stopOperator: e.stopOperator,
          orgId: e.orgId,
          seq: e.seq
        };
        maItem.stopDate = isEmpty(maItem.stopDate) ? '' : maItem.stopDate + ' 23:59:59';

        sveOrupdateitems.push(maItem);
      });
      InsertRecords.forEach((e: any) => {
        const maItem = {
          id: e.id,
          materialId: e.materialId,
          materialItemId: e.materialItemId,
          qcItemId: e.qcItemId,
          instrId: e.instrId,
          itemDictId: e.itemDictId,
          enableDate: e.enableDate,
          isAlarm: e.isAlarm,
          isOutControl: e.isOutControl,
          result: e.result,
          numResult: e.numResult,
          z: e.z,
          stopDate: e.stopDate,
          stopOperator: e.stopOperator,
          orgId: store.userInfo.orgId,
          seq: e.seq
        };
        maItem.stopDate = isEmpty(maItem.stopDate) ? '' : maItem.stopDate + ' 23:59:59';

        sveOrupdateitems.push(maItem);
      });

      if (sveOrupdateitems.length > 0) {
        const url = '/api/qc/qcMaterialItemFixed/saveOrUpdateMaterialFixed';
        const obj: any = {};
        obj.materialFixedList = sveOrupdateitems;
        obj.jsJgFlag = jsJgFlag.value;
        proxy.$http
          .post(url, obj)
          .then((res: any) => {
            VxeMessage('修改成功', VxeNotifyType.success);
            setTimeout(() => {
              jsJgFlag.value = '0';
              findMaterialFixedList();
            }, 50);
          })
          .catch((err: any) => {
            VxeMessage('修改失败', VxeNotifyType.success);
          });
      } else {
        VxeMessage('无添加或修改数据', VxeNotifyType.error);
      }
    } else {
      return;
    }
  }
}

// 删除质控靶值设定表格数据
function deleteMaterialFixed() {
  const sltMaterialFixeds = (proxy.$refs.materialFixedTableRef as any).getCheckboxRecords();
  if (!(sltMaterialFixeds.length > 0)) {
    VxeMessage('请勾选要删除的数据', VxeNotifyType.info);
  } else {
    proxy
      .$confirm('确定要删除当前勾选的数据？', '提示', {
        cancelButtonClass: 'cancel-button',
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
      .then(() => {
        const data = { materialFixedList: sltMaterialFixeds };
        const url = '/api/qc/qcMaterialItemFixed/batchDeleteMaterialFixedList';
        proxy.$http
          .post(url, data)
          .then((res: any) => {
            findMaterialFixedList(); // 获取检验仪器表格数据
            VxeMessage(res.status.msg, VxeNotifyType.success);
          })
          .catch((err: any) => {
            VxeMessage(err, VxeNotifyType.error);
          });
      })
      .catch((err: any) => {
        // VxeMessage(err, VxeNotifyType.error);
      });
  }
}

// 同步数据
async function sysMaterial() {
  const url = '/api/iqc/limsIQCMaterial/syncQcMaterialItemResultGdb';

  proxy.$http
    .get(url)
    .then((res: any) => {})
    .catch((err: any) => {
      VxeMessage('同步失败', VxeNotifyType.error);
    });
}
</script>

<style lang="scss" scoped>
#qcMaterialDiv {
  height: 100%;
  .bodyContent {
    height: calc(100% - 60px);
    .splitpanes {
      background-color: $base-white;
      // 附加按钮间距
      .button-blue,
      .button-red {
        margin: 5px 0 5px 5px;
      }
      .compute-button {
        background-color: #89d7fc;
      }
    }
    .horizontalLine {
      :deep(.splitpanes__splitter) {
        background-color: $base-white;
      }
    }

    // 中间table表格
    .tableBody {
      height: calc(100% - 40px);
    }
    // 质控靶值设定弹框表格
    .tableTargetBody {
      height: 600px;
      .tableTargetBodyRight {
        height: calc(100% - 2px);
        border: 1px solid #e8eaec;

        .closeBtn {
          margin-left: 720px;
        }
      }
    }

    // 右侧保存按钮
    .saveBtn {
      float: right;
      margin: 5px 10px;
    }
    .el-form {
      padding-right: 15px;
      .el-form-item--large {
        margin-bottom: 10px;
      }
      .el-button {
        padding: 5px 2px !important;
      }
      :deep(.el-input__inner) {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }

    // 弹框
    .el-dialog {
      font-weight: 700;
      max-height: 1000px;
      padding: 10px;
    }
    // 最右侧质控项目设定表格
    .tableBox {
      height: calc(100% - 40px);
    }
  }
}
</style>
